import React from 'react'
import {Table} from 'antd';
import { useSelector } from 'react-redux'

export default function Record() {
  const languages = useSelector((state) => state.publicReducer.language)
    const data = [
        {
          key: '1',
          구매일자: '2022.11.29',
          구매금액: '50,000',
          쿠폰명: '5',
          레벨: '3',
          사용금액:"35,200",
          잔여금액:"14,800",
          유효기간:"2023.01.09",
          상태:"사용중"
        },
        {
          key: '2',
          구매일자: '2022.11.28',
          구매금액: '50,000',
          쿠폰명: '5',
          레벨: '3',
          사용금액:"35,200",
          잔여금액:"14,800",
          유효기간:"2023.01.09",
          상태:"기간만료"
        },
        {
          key: '3',
          구매일자: '2022.11.27',
          구매금액: '50,000',
          쿠폰명: '5',
          레벨: '3',
          사용금액:"35,200",
          잔여금액:"14,800",
          유효기간:"2023.01.09",
          상태:"사용완료"
        },
      ]
      const columns = [
        {
          title: languages === "Korean" ? "구매 일자" : (languages === "Chinese" ? "购买日期" : "Date"),
          key: '구매일자',
          dataIndex: '구매일자',
          align:"center",
        },
        {
          title: languages === "Korean" ? "구매 금액" : (languages === "Chinese" ? "优惠卷金额" : "Amount"),
          dataIndex:'구매금액',
          key: '구매금액',
          align:"center",
        },
        {
          title: languages === "Korean" ? "쿠폰명" : (languages === "Chinese" ? "优惠卷名称" : "Name"),
          dataIndex: '쿠폰명',
          key: '쿠폰명',
          align:"center",
          render:(row)=> <span>{row}{languages === "Korean" ? "만원" : (languages === "Chinese" ? "韩元" : "won")}</span>
        },
        {
          title: languages === "Korean" ? "레벨" : (languages === "Chinese" ? "等级" : "level"),
          dataIndex: '레벨',
          key: '레벨',
          align:"center",
        },
        {
          title: languages === "Korean" ? "사용 금액" : (languages === "Chinese" ? "已用优惠卷" : "Used amount"),
          dataIndex: '사용금액',
          key: '사용금액',
          align:"center",
          render:(row)=> "₩" + row
        },
        {
          title: languages === "Korean" ? "잔여 금액" : (languages === "Chinese" ? "优惠卷余额" : "Balance"),
          dataIndex: '잔여금액',
          key: '잔여금액',
          align:"center",
          render:(row)=> "₩" + row
        },
        {
          title: languages === "Korean" ? "유효 기간" : (languages === "Chinese" ? "有效期" : "Validity"),
          dataIndex: '유효기간',
          key: '유효기간',
          align:"center",
        },
        {
            title: languages === "Korean" ? "상태" : (languages === "Chinese" ? "状态" : "Status"),
            dataIndex: '상태',
            key: '상태',
            align:"center",
          },
      ]
  return (
    <div>
      <div>
        <Table size={'small'} columns={columns} dataSource={data} pagination={false} />
        </div>
    </div>
  )
}
